<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
		<title>客户详情</title>
		<link rel="icon" href="favicon.ico" type="image/ico">
		<script src="./js/xlsx.full.min.js"></script>
		<meta name="author" content="yinqi">
		<link href="css/bootstrap.min.css" rel="stylesheet">
		<link href="css/materialdesignicons.min.css" rel="stylesheet">
		<link href="css/style.css" rel="stylesheet">

		<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
		<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
		<link rel="stylesheet" type="text/css" href="layui/layui/css/layui.css">
		<!--对话框-->
		<link rel="stylesheet" href="js/jconfirm/jquery-confirm.min.css">
		<script type="text/javascript" src="layui/layui/layui.js"></script>
		<link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.19.1/dist/bootstrap-table.min.css">
		<script src="https://unpkg.com/bootstrap-table@1.19.1/dist/bootstrap-table.min.js"></script>
		<script src="js/bootstrap-table-zh-CN.min.js"></script>
		<script src="js/ServerUrl.js"></script>
		<script type="text/javascript">
			function initTrackTable(clientid) {
				//生成用户数据
				$('#tracktable').bootstrapTable({
					method: 'get',
					contentType: "application/x-www-form-urlencoded",
					dataType: "json",
					url: serverUrl + "/getTrackByClientid?clientid=" + clientid,
					cardView: true, //是否显示详细视图
					detailView: false, //是否显示父子表
					columns: [{
							title: '跟踪结果',
							field: 'trackresult',
							sortable: false,
							align: 'center',
							formatter: addResult //添加按钮
						},

						{
							title: '负责人',
							field: 'contactname',
							align: 'center'
						},
						{
							title: '记录日期',
							field: 'tracktime',
							sortable: false,
							align: 'center'
						},
						{
							title: '详情',
							align: 'center',
							formatter: addView //添加按钮
						}
					],
					locale: 'zh-CN' //中文支持,
				})

				function addView(value, row, index) {
					return "<button type='button' class='btn btn-xs btn-normal' onclick='viewTrackbtn(\"" + row.contactname +
						"\",\"" +
						row.tracktime + "\",\"" + row.trackresult + "\")'>查看</button>"
				}
				function addResult(value, row, index) {
					return '<label style="color: #1634bb;">\"'+value+'\"</label>'
				}


			}

			function viewTrackbtn(viewcontactname, viewtracktime, viewtrackresult) {
				// alert(row);
				document.getElementById('viewtracktime').value = viewtracktime;
				document.getElementById('viewcontactname').value = viewcontactname;
				document.getElementById('viewtrackresult').value = viewtrackresult;
				$('#viewTrack').modal();
			}
			var url = location.search; //获取url中"?"符后的字串 ('?modFlag=business&role=1')
			var theRequest = new Object();
			if (url.indexOf("?") != -1) {
				var str = url.substr(1); //substr()方法返回从参数值开始到结束的字符串；
				var strs = str.split("&");
				for (var i = 0; i < strs.length; i++) {
					theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1]);
				}
			}
			var rowCount = 1; //(资源)行数默认1行 
			//添加资源输入框项 
			function addCenterIpGrp(obj) {
				rowCount++
				html = '<div style="margin: 0px 0px 10px;"  class="input-group centerIp">' +
					'<div class="col-md-6">' +
					'<input class="form-control rewardId" required="required" placeholder="姓名" type="text" name="contactname' +
					rowCount +
					'" id="contactname' + rowCount +
					'" >' +
					'</div>' +
					'<div class="col-md-6">' +
					' <input class="form-control rewardNum" required="required" placeholder="电话" type="text" name="phone' +
					rowCount +
					'" id="phone' +
					rowCount + '" >' +
					'</div>' +
					' <span class="input-group-btn">' +
					'<button class="btn btn-info" type="button" data-toggle="tooltip" id="delCenterIpGrp"><span class="glyphicon glyphicon-minus">-</span></button>' +
					' </span>' +
					'</div>'
				obj.insertAdjacentHTML('beforebegin', html)
			}
			$(document).on('click', '#delCenterIpGrp', function() {
				var el = this.parentNode.parentNode;
				var centerIp = $(this).parent().parent().find('#ipInput').val();
				el.parentNode.removeChild(el);
				rowCount--;
			})
			var fileurl = "";




			// 请求意向评分
			var scorevalueSum = 0;
			var scorevaluePlus = [];

			function findScoreAll() {
				$.ajax({
					//几个参数需要注意一下
					type: "get", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/findScoreAll",
					success: function(result) {
						for (var i = 0; i < result.length; i++) {
							$('#checkboxgroup').append('<label class="checkbox checkbox-inline checkbox-primary">' +
								'<input value="' + result[i].score +
								'" onclick="alertvalue(this)" name="checkBox" type="checkbox" id="' + result[i]
								.id +
								'">' +
								'<span>' + result[i].scorename + '</span></label>');
						}
						findScoreThisClient();
					},
					error: function() {
						layer.msg('findScoreAll异常');
					}
				});
			}


			function findScoreThisClient() {
				$.ajax({
					//几个参数需要注意一下
					type: "post", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					data: {
						"demandid": document.getElementById("demandid").value
					},
					url: serverUrl + "/findScoreThisClient",
					success: function(result) {
						var trackrecord = result.trackrecord;
						var remark = result.remark;
						trackrecords = trackrecord.split(",");
						for (var i = 0; i < trackrecords.length; i++) {
							var boxes = document.getElementsByName("checkBox");
							boxes[trackrecords[i] - 1].checked = true;
							scorevalueSum += Number(boxes[trackrecords[i] - 1].value);
							scorevaluePlus.push(trackrecords[i]);
						}
						$('#scoreTitle').text("该用户意向评分：" + scorevalueSum + "分");
						$('#nowScore').text("该用户意向评分：" + scorevalueSum + "分");
						// console.log(remark);
						document.getElementById("remark").value = remark;
					},
					error: function() {
						layer.msg('findScoreThisClient异常');
					}
				});
			}
			Array.prototype.indexOf = function(val) {
				for (var i = 0; i < this.length; i++) {
					if (this[i] == val) return i;
				}
				return -1;
			};
			Array.prototype.remove = function(val) {
				var index = this.indexOf(val);
				if (index > -1) {
					this.splice(index, 1);
				}
			};

			function alertvalue(checkbox) {
				if ($(checkbox).is(":checked") == true) {
					scorevalueSum += Number(checkbox.value);
					$('#scoreTitle').text("该用户意向评分：" + scorevalueSum + "分");
					$('#nowScore').text("该用户意向评分：" + scorevalueSum + "分");
					scorevaluePlus.push(checkbox.id);
					// for (var i = 0; i < scorevaluePlus.length; i++) {
					// 	console.log(scorevaluePlus[i]);
					// }
				} else {
					scorevalueSum -= Number(checkbox.value);
					$('#scoreTitle').text("该用户意向评分：" + scorevalueSum + "分");
					$('#nowScore').text("该用户意向评分：" + scorevalueSum + "分");
					scorevaluePlus.remove(checkbox.id);
					// for (var i = 0; i < scorevaluePlus.length; i++) {
					// 	console.log(scorevaluePlus[i]);
					// }
				}
			}

			function submitScoreAndRemark() {
				$.ajax({
					//几个参数需要注意一下
					type: "POST", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/updateScoreRemark", //url
					data: {
						"demandid": document.getElementById("demandid").value,
						"trackrecord": (scorevaluePlus).toString(),
						"remark": document.getElementById("remark").value
					},
					success: function(result) {
						if (result.status == 200) {
							layer.msg('评分备注提交成功');
						} else if (result.status == 404) {
							layer.msg('评分备注提交失败');
						}
					},
					error: function() {
						layer.msg('表单提交异常');
					}
				});
			}
			// 请求意向评分结束
			function submitClient() {
				var contactinfo = "";
				// console.log("rowCount:", rowCount);
				for (var i = 2; i <= rowCount; i++) {
					var contactname = document.getElementById("contactname" + i).value;
					var phone = document.getElementById("phone" + i).value;
					if (contactname != "" && phone != "")
						contactinfo += contactname + "@@@@" + phone + "@@@@@";
					else {
						layer.msg('检查联系人信息是否漏填');
						return;
					}
				}
				var clientid = theRequest.id;
				var clientgrade = document.getElementById("clientgrade").value;
				var clientno = document.getElementById("clientno").value;
				var date = document.getElementById("date").value;
				var companyboss = document.getElementById("companyboss").value;
				var companyname = document.getElementById("companyname").value;
				var companykindid = $('#companykindid').val();
				var businessrange = document.getElementById("businessrange").value;
				var position = document.getElementById("position").value;
				var companyscale = document.getElementById("companyscale").value;

				var demandid = document.getElementById("demandid").value;
				var purchase = document.getElementById("purchase").value;
				var boxtypeid = document.getElementById("boxtypeid").value;
				var shippingaddress = document.getElementById("shippingaddress").value;
				var distance = document.getElementById("distance").value;
				var payperiod = document.getElementById("payperiod").value;
				var payway = document.getElementById("payway").value;
				var companylevel = document.getElementById("companylevel").value;
				var riskinformation = document.getElementById("riskinformation").value;
				var needsize = document.getElementById("needsize").value;
				if (!(clientgrade != "" &&
						clientno != "" &&
						date != "" &&
						companyboss != "" &&
						companyname != "" &&
						companykindid != "" &&
						businessrange != "" &&
						position != "" &&
						companyscale != "" &&
						purchase != "" &&
						boxtypeid != "" &&
						shippingaddress != "" &&
						distance != "" &&
						payperiod != "" &&
						payway != "" &&
						companylevel != "" &&
						riskinformation != "" &&
						needsize != ""
					)) {
					layer.msg('检查是否有漏填项');
					return;
				}
				$.ajax({
					//几个参数需要注意一下
					type: "POST", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/updateClientDemand", //url
					data: {
						"clientid": clientid,
						"clientgrade": clientgrade,
						"clientno": clientno,
						"date": date,
						"companyboss": companyboss,
						"companyname": companyname,
						"companykindid": companykindid,
						"businessrange": businessrange,
						"contactinfo": contactinfo,
						"position": position,
						"companyscale": companyscale,
						"demandid": demandid,
						"purchase": purchase,
						"boxtypeid": boxtypeid,
						"shippingaddress": shippingaddress,
						"distance": distance,
						"payperiod": payperiod,
						"payway": payway,
						"companylevel": companylevel,
						"riskinformation": riskinformation,
						"needsize": needsize
					},
					success: function(result) {
						// console.log(result);
						if (result.status == 404) {
							// alert("请检查客户编号是否重复");
							layer.msg('修改信息失败，请检查');
						} else if (result.status == 200) {
							// layer.alert('录入成功');
							layer.msg('修改信息成功');
						}
					},
					error: function() {
						layer.msg('修改信息提交异常');
					}
				});
			}

			function completeDemand() {
				$.confirm({
					title: '完结提示',
					content: "此操作代表此单已经交易成功或遭遇其他异常需要完结，此后此客户所有信息将变为只读，不可重新修改，请确认是否继续？",
					type: 'red',
					typeAnimated: true,
					buttons: {
						tryAgain: {
							text: '确认',
							btnClass: 'btn-red',
							action: function() {
								$.ajax({
									//几个参数需要注意一下
									type: "POST", //方法类型
									dataType: "json", //预期服务器返回的数据类型
									url: serverUrl + "/completeDemand", //url
									data: {
										"demandid": document.getElementById('demandid').value
									},
									success: function(result) {
										completeFunction();
										layer.msg('订单已完结');
									},
									error: function() {
										layer.msg('订单完结异常');
									}
								});
							}
						},
						close: {
							text: '取消'
						}
					}
				});

			}

			function requestOption() {
				$.ajax({
					//几个参数需要注意一下
					type: "get", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/findKind",
					success: function(result) {
						for (var i = 0; i < result.length; i++) {
							$('#companykindid').append('<option value="' + result[i].id + '">' + result[i]
								.companykind + '</option>');
						}
					},
					error: function() {
						layer.msg('findKind异常');
					}
				});

				$.ajax({
					//几个参数需要注意一下
					type: "get", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/findBoxtype",
					success: function(result) {
						for (var i = 0; i < result.length; i++) {
							$('#boxtypeid').append('<option value="' + result[i].id + '">' + result[i]
								.boxtype + '</option>');
						}
					},
					error: function() {
						layer.msg('findBoxtype异常');
					}
				});

				$.ajax({
					//几个参数需要注意一下
					type: "get", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/findPayperiod",
					success: function(result) {
						for (var i = 0; i < result.length; i++) {
							$('#payperiod').append('<option value="' + result[i].id + '">' + result[i]
								.payperiod + '</option>');
						}
					},
					error: function() {
						layer.msg('findPayperiod异常');
					}
				});

				$.ajax({
					//几个参数需要注意一下
					type: "get", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/findRisk",
					success: function(result) {
						for (var i = 0; i < result.length; i++) {
							$('#riskinformation').append('<option value="' + result[i].id + '">' + result[i]
								.riskinfo + '</option>');
						}
					},
					error: function() {
						layer.msg('findRisk异常');
					}
				});
			}
			requestOption();

			function btnSubmit() {
				$.ajax({
					//几个参数需要注意一下
					type: "POST", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/findContact", //url
					data: {
						"id": theRequest.id
					},
					success: function(result) {
						for (var i = 1; i < result.length; i++) {
							document.getElementById("addCenterIpGrpBtn").click();
						}
						for (var i = 0; i < result.length; i++) {
							var temp = i + 2;
							$("#contactname" + temp).attr("value", result[i].contactname);
							$("#phone" + temp).attr("value", result[i].phone);

						}
					},
					error: function() {
						layer.msg('表单提交异常');
					}
				});
				$.ajax({
					//几个参数需要注意一下
					type: "POST", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/findByClientid", //url
					data: {
						"id": theRequest.id
					},
					success: function(result) {
						// console.log(result);
						// console.log('result[0].demandid', result[0].demandid);
						if (result[0].costfile != null && result[0].costfile != "") {
							readExcelFromUrl(result[0].costfile);
							$("#textfield").val("成本分析.xlsx");
							fileurl = result[0].costfile;
							$("#download").attr("style", "");
							$("#preview").attr("style", "");
						} else {
							$("#textfield").val("无文件");
						}
						$("#demandid").val(result[0].demandid);
						$("#clientgrade").val(result[0].clientgrade);
						$("#clientno").val(result[0].clientno);
						$("#date").val(result[0].date);
						$("#companyboss").val(result[0].companyboss);
						$("#companyname").val(result[0].companyname);
						$("#companykindid").find("option[value='" + result[0].companykindid + "']").attr("selected",
							true);
						$("#businessrange").val(result[0].businessrange);
						$("#position").val(result[0].position);
						$("#companyscale").val(result[0].companyscale);
						$("#purchase").val(result[0].purchase);
						$("#boxtypeid").find("option[value='" + result[0].boxtypeid + "']").attr("selected", true);
						$("#shippingaddress").val(result[0].shippingaddress);
						$("#distance").val(result[0].distance);
						$("#payperiod").find("option[value='" + result[0].payperiod + "']").attr("selected", true);
						$("#payway").val(result[0].payway);
						$("#companylevel").val(result[0].companylevel);
						$("#riskinformation").find("option[value='" + result[0].riskinformationid + "']").attr(
							"selected", true);
						$("#needsize").val(result[0].needsize);
						findScoreAll();
						if (result[0].completestatus == "true") {
							completeFunction();
						}
						initTrackTable(theRequest.id);
					},
					error: function() {
						layer.msg('表单提交异常');
					}
				});
			}
			btnSubmit();

			function addTrack() {
				var tracktime = document.getElementById('tracktime').value;
				var trackresult = document.getElementById('trackresult').value;
				var contactname = document.getElementById('contactname').value;
				$.ajax({
					//几个参数需要注意一下
					type: "POST", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: serverUrl + "/addTrack",
					data: {
						"tracktime": tracktime,
						"trackresult": trackresult,
						"contactname": contactname,
						"clientid": theRequest.id
					},
					success: function(result) {
						$('#tracktable').bootstrapTable('refresh');
					},
					error: function() {
						layer.msg('addTrack异常');
					}
				});
			}

			function completeFunction() {
				$('#uploadForm').find('input,textarea,select').attr('readonly', true);
				$("#submitClientbtn").attr("style", "display:none;");
				$("#completeDemandbtn").attr("disabled", true);
				$("#completeDemandbtn").attr("value", "已完结订单不可修改");
				$("#excelImport").attr("disabled", true);
				$("#submitScoreRemark").attr("disabled", true);
				$('#submitScoreRemark').text("已完结订单不可修改");
			}

			function downloadExcel() {
				window.location.href = fileurl;
			}
			// 从网络上读取某个excel文件，url必须同域，否则报错
			function readExcelFromUrl(url, callback) {
				var xhr = new XMLHttpRequest();
				xhr.open('get', url, true);
				xhr.setRequestHeader("Content-Type", 'application/json;charset=UTF-8');
				xhr.responseType = 'arraybuffer';
				xhr.onload = function(e) {
					if (xhr.status == 200) {
						var data = new Uint8Array(xhr.response)
						var workbook = XLSX.read(data, {
							type: 'array'
						});
						var data = XLSX.utils.sheet_to_json(workbook.Sheets.Sheet1);
						// console.log('data', data);
						var keyAry = [];
						// 遍历json对象，获取每一列的键名
						for (var key in data[1]) {
							keyAry.push(key);
						}
						// console.log(keyAry)
						// 清除上次渲染的表格
						$("#demo").empty();
						// 设置表格头
						$(`<thead><tr class='thead-tr'></tr></thead>`).appendTo($("#demo"))
						keyAry.forEach(e => {
							$(`<th>${e}</th>`).appendTo($(".thead-tr"));
						})

						for (var d of data) {
							// 通过循环,每有一条数据添加一行表格
							var tr = $("<tr></tr>");
							for (var n = 0; n < keyAry.length; n++) {
								// 根据keyAry数组的长度,创建每一行表格中的td
								$("<td></td>").html("").addClass(keyAry[n]).appendTo(tr);
							}
							// 遍历对象,根据键名找到是哪一列的数据,给对应的td添加内容
							for (k in d) {
								// (tr[0].children[keyAry.indexOf(k)])
								$(tr[0].children[keyAry.indexOf(k)]).html(d[k]);
							}
							tr.appendTo($("#demo"));
						}
					}
				};
				xhr.send();
			}
			$(document).ready(function() {
				$("#excelImport").click(function() {
					$('#fileupload').click();
				});

				$('#fileupload').change(function() {
					ViewExcel(this);
					document.getElementById("textfield").value =
						document.getElementById("fileupload").files[0].name;

					var formData = new FormData($('#uploadForm')[0]);
					var demandid = document.getElementById("demandid").value;
					// console.log(demandid);
					$.ajax({
						url: serverUrl + "/uploadexcel",
						type: 'POST',
						data: formData,
						processData: false, // 使数据不做处理
						contentType: false, // 不要设置Content-Type请求头
						dataType: 'text',
						success: function(data) {
							fileurl = data;
							$("#download").attr("style", "");
							$("#preview").attr("style", "");
							layer.msg("文件上传成功");
						},
						error: function(data) {
							layer.msg("文件上传异常");
						}
					});

				})
			});
			var wb; //读取完成的数据
			var rABS = false; //是否将文件读取为二进制字符串

			function ViewExcel(obj) { //导入
				if (!obj.files) {
					return;
				}
				var f = obj.files[0];
				// console.log('打印f', f);
				var reader = new FileReader();
				reader.onload = function(e) {
					// console.log(e.target.result);
					if (rABS) {
						wb = XLSX.read(btoa(fixdata(e.target.result)), { //手动转化
							type: 'base64'
						});
					} else {
						wb = XLSX.read(e.target.result, {
							type: 'binary'
						});
					}
					//wb.SheetNames[0]是获取Sheets中第一个Sheet的名字
					//wb.Sheets[Sheet名]获取第一个Sheet的数据
					var data = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
					// console.log('wb.Sheets[wb.SheetNames[0]]', wb.Sheets[wb.SheetNames[0]]);
					var keyAry = [];
					// 遍历json对象，获取每一列的键名
					for (var key in data[1]) {
						keyAry.push(key);
					}
					// console.log(keyAry)
					// 清除上次渲染的表格
					$("#demo").empty();
					// 设置表格头
					$(`<thead><tr class='thead-tr'></tr></thead>`).appendTo($("#demo"))
					keyAry.forEach(e => {
						$(`<th>${e}</th>`).appendTo($(".thead-tr"));
					})

					for (var d of data) {
						// 通过循环,每有一条数据添加一行表格
						var tr = $("<tr></tr>");
						for (var n = 0; n < keyAry.length; n++) {
							// 根据keyAry数组的长度,创建每一行表格中的td
							$("<td></td>").html("").addClass(keyAry[n]).appendTo(tr);
						}
						// 遍历对象,根据键名找到是哪一列的数据,给对应的td添加内容
						for (k in d) {
							// (tr[0].children[keyAry.indexOf(k)])
							$(tr[0].children[keyAry.indexOf(k)]).html(d[k]);
						}
						tr.appendTo($("#demo"));
					}
				}
				if (rABS) {
					reader.readAsArrayBuffer(f);
				} else {
					reader.readAsBinaryString(f);
				}
			}

			function fixdata(data) { //文件流转BinaryStrings
				var o = "",
					l = 0,
					w = 10240;
				jsArry = [];
				for (; l < data.byteLength / w; ++l) jsArry.push(String.fromCharCode.apply(null, new Uint8Array(data.slice(
					l * w,
					l * w + w))));
				return jsArry;
			}
		</script>

	</head>

	<body>

		<!--页面主要内容-->
		<div class="container-fluid">
			<div class="row">
				<div class="layout-sidebar-scroll">
				</div>
				<form id="uploadForm" class="form-horizontal" onsubmit="return false" action="#" method="post"
					enctype="multipart/form-data">
					<div class="col-md-6">
						<div class="card">

							<div class="card-body">

								<ul class="nav nav-tabs nav-justified">
									<li class="active">
										<a data-toggle="tab" href="#home-basic">客户基本信息</a>
									</li>
									<li class="nav-item">
										<a data-toggle="tab" href="#profile-basic">需求信息</a>
									</li>
								</ul>
								<div class="tab-content">
									<div class="tab-pane fade active in" id="home-basic">
										<div class="form-group">
											<div class="col-xs-6">
												<label>客户等级</label>
												<input required="required" class="form-control" type="text"
													id="clientgrade" name="clientgrade">
											</div>
											<div class="col-xs-6">
												<label>客户编号</label>
												<input required="required" class="form-control" type="text"
													id="clientno" name="clientno">
											</div>
										</div>
										<div class="form-group">

											<div class="col-xs-6">
												<label>录入日期</label>
												<input required="required" class="form-control js-datepicker m-b-10"
													type="text" id="date" name="date" value=""
													data-date-format="yyyy-mm-dd" />
											</div>

											<div class="col-xs-6">
												<label>归属人</label>
												<input required="required" class="form-control" type="text"
													id="companyboss" name="companyboss">
											</div>
										</div>
										<div class="form-group">
											<div class="col-xs-6">
												<label>公司名称</label>
												<input required="required" class="form-control" type="text"
													id="companyname" name="companyname">
											</div>
											<div class="col-xs-6">
												<label>公司类型</label>
												<select required="required" class="form-control" id="companykindid"
													name="companykindid">
												</select>
											</div>
										</div>
										<div class="form-group">
											<div class="col-xs-12">
												<label>经营范围</label>
												<textarea required="required" class="form-control" id="businessrange"
													name="businessrange" rows="2"></textarea>
											</div>
										</div>
										<div class="form-group">
											<div class="col-xs-6">
												<label>职位</label>
												<input required="required" class="form-control" type="text"
													id="position" name="position">
											</div>
											<div class="col-xs-6">
												<label>公司规模</label>
												<input required="required" class="form-control" type="text"
													id="companyscale" name="companyscale" placeholder="公司规模">
											</div>
										</div>
										<hr>
										<div class="input-group" id="centerIpGroup">
											<label class="input-group-addon"><br>联<br><br>系<br><br>人<br><br></label>
											<div class="col-xs-12">
												<button class="btn btn-info" type="button" data-toggle="tooltip"
													id="addCenterIpGrpBtn" onclick="addCenterIpGrp(this)"><span
														class="glyphicon glyphicon-plus">+</span></button>
											</div>
											<script>
												document.getElementById("addCenterIpGrpBtn").click();
											</script>
										</div>
									</div>
									<div class="tab-pane fade" id="profile-basic">

										<div class="form-group">
											<input required="required" class="form-control" type="text" id="demandid"
												name="demandid" style="display:none">
											<div class="col-xs-6">
												<label>定制类型</label>
												<select class="form-control" id="boxtypeid" name="boxtypeid">
												</select>
											</div>
											<div class="col-xs-6">
												<label>月购额(万)</label>
												<input required="required" class="form-control" type="text"
													id="purchase" name="purchase">
											</div>
										</div>
										<div class="form-group">
											<div class="col-xs-6">
												<label>送货地址</label>
												<input required="required" class="form-control" type="text"
													id="shippingaddress" name="shippingaddress">
											</div>
											<div class="col-xs-6">
												<label>距离</label>
												<input required="required" class="form-control" type="text"
													id="distance" name="distance">
											</div>
										</div>
										<div class="form-group">
											<div class="col-xs-6">
												<label>付款账期</label>
												<select class="form-control" id="payperiod" name="payperiod">
												</select>
											</div>
											<div class="col-xs-6">
												<label>付款方式</label>
												<input required="required" class="form-control" type="text" id="payway"
													name="payway">
											</div>
										</div>
										<div class="form-group">
											<div class="col-xs-6">
												<label>企业级别</label>
												<input required="required" class="form-control" type="text"
													id="companylevel" name="companylevel">
											</div>
											<div class="col-xs-6">
												<label>需求尺寸</label>
												<input required="required" class="form-control" type="text"
													id="needsize" name="needsize">
											</div>
										</div>
										<div class="form-group">
											<div class="col-xs-12">
												<label>风险信息</label>
												<select class="form-control" id="riskinformation"
													name="riskinformation">
												</select>
											</div>

										</div>
										<div class="form-group">
											<div class="col-xs-12">
												<label></label>
											</div>
											<div class="col-xs-12">
												<label style="color: #bbb;">【注】谨慎提交对上述（客户信息和需求信息）的修改</label>
											</div>
											<div class="col-xs-12">
												<label></label>
											</div>
											<div class="col-xs-12">
												<input id="submitClientbtn" onclick="submitClient()" type="button"
													value="提交修改" class="btn btn-info" />
												<input id="completeDemandbtn" onclick="completeDemand()" type="button"
													value="完结该订单" class="btn btn-danger" />
											</div>

										</div>
									</div>
								</div>

							</div>
						</div>


					</div>

					<div class="col-md-6">

						<div class="card">

							<div style="padding: 15px 15px 0px 25px;">
								<h4 id="scoreTitle">该用户意向评分：0分</h4>
							</div>
							<div style="padding: 15px 20px 15px 20px;">
								<div class="guide-box">
									<ul class="nav-step step-dots">
										<li class="nav-step-item active">
											<span>勾选评分</span>
											<a class="active" data-toggle="tab" href="#step-1"></a>
										</li>

										<li class="nav-step-item">
											<span>备注</span>
											<a data-toggle="tab" href="#step-2"></a>
										</li>
										<li class="nav-step-item">
											<span>提交</span>
											<a data-toggle="tab" href="#step-3"></a>
										</li>
									</ul>
									<!--对应内容-->
									<div class="nav-step-content" style="padding: 5px 5px 5px 5px;">
										<div class="nav-step-pane hidden active" id="step-1">
											<div class="form-group">
												<div style="text-align:center;">
													　　<span style="display:inline-block;width:100%">
														<div id="checkboxgroup" class="example-box">

														</div>
													</span>
												</div>
											</div>
										</div>

										<div class="nav-step-pane hidden" id="step-2">
											<div class="form-group">
												<div class="col-xs-12">
													<textarea placeholder="备注" required="required" class="form-control"
														id="remark" name="remark" rows="2"></textarea>
												</div>
											</div>
										</div>

										<div class="nav-step-pane hidden" id="step-3">
											<div class="form-group">
												<div class="col-xs-12">
													<label></label>
												</div>
												<div class="col-xs-12">
													<label id="nowScore">当前评分：0分</label>
												</div>
											</div>
										</div>
									</div>
									<!--End 对应内容-->
									<div class="nav-step-button">
										<button class="btn btn-secondary disabled" data-wizard="prev"
											type="button">上一步</button>
										<button class="btn btn-secondary" data-wizard="next" type="button">下一步</button>
										<button class="btn btn-primary hidden" data-wizard="finish" type="button"
											id="submitScoreRemark" onclick="submitScoreAndRemark()">确认并提交</button>
									</div>
								</div>
							</div>
						</div>
						<div class="card">
							<!-- <div style="padding: 15px 15px 15px 25px;">
								<h4>该客户成本分析</h4>
							</div> -->
							<div style="padding: 15px 15px 1px 20px;">
								<div class="form-group">

									<div class="col-xs-2">
										<input id="excelImport" type="button" value="上传" class="btn btn-primary" />
									</div>
									<div class="col-xs-4">
										<input id="fileupload" type="file" name="fileupload" accept=".xlsx,.xls"
											multiple="" style="display:none;" />
										<input placeholder="成本分析文件" type='text' class="form-control" name='textfield'
											id='textfield' autocomplete="off" readonly="readonly" />

									</div>


									<div class="col-xs-6">
										<input id="download" onclick="downloadExcel()" type="button" value="下载"
											class="btn btn-info" style="display:none;" />
										<input id="preview" data-toggle="modal" data-target="#exampleModal"
											type="button" value="预览" class="btn btn-danger" style="display:none;" />
									</div>
								</div>

								<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog"
									aria-labelledby="exampleModalLabel">
									<div class="modal-dialog" role="document">
										<div class="modal-content">
											<div class="modal-header">
												<button type="button" class="close" data-dismiss="modal"
													aria-label="Close"><span aria-hidden="true">&times;</span></button>
												<h3 class="modal-title" id="exampleModalLabel">预览Excel内容</h3>
											</div>
											<div class="modal-body">
												<div style="width:100%; height:250px; overflow:auto;">
													<table id="demo"
														class="table table-bordered table-hover table-striped">
													</table>
												</div>
											</div>
											<div class="modal-footer">
												<button type="button" class="btn btn-info"
													data-dismiss="modal">关闭</button>
											</div>
										</div>
									</div>
								</div>

							</div>
						</div>
						<div class="card">

							<div class="card-header">

								<h4>该客户跟踪记录</h4>
								<button class="btn btn-round btn-info" style="float: right;margin-right: 10px;"
									data-toggle="modal" data-target="#addTrackModal">添加</button>

							</div>
							<div class="layout-sidebar-scroll">
							</div>
							<div style="padding: 15px 20px 15px 20px;">
								<div style="height:190px; overflow:auto;">
									<table id="tracktable" class="table">

									</table>
								</div>

							</div>

						</div>

					</div>
				</form>
				<div class="modal fade" id="addTrackModal" tabindex="-1" role="dialog"
					aria-labelledby="exampleModalLabel">
					<div class="modal-dialog" role="document">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
										aria-hidden="true">&times;</span></button>
								<h3 class="modal-title" id="exampleModalLabel">添加跟踪记录</h3>
							</div>
							<div class="modal-body">
								<div class="row">
									<div class="form-group">

										<div class="col-xs-6">
											<label>跟踪日期</label>
											<input required="required" class="form-control js-datepicker m-b-10"
												type="text" id="tracktime" name="tracktime" value=""
												data-date-format="yyyy-mm-dd" />
										</div>

										<div class="col-xs-6">
											<label>负责人</label>
											<input required="required" class="form-control" type="text" id="contactname"
												name="contactname">
										</div>
									</div>
									<div class="form-group">
										<div class="col-xs-12">
											<label>简短描述过程及结果</label>
											<textarea required="required" class="form-control" id="trackresult"
												name="trackresult" rows="4"></textarea>
										</div>
									</div>
								</div>

							</div>
							<div class="modal-footer">
								<button type="button" class="btn btn-primary" data-dismiss="modal"
									onclick="addTrack()">添加</button>
								<button type="button" class="btn btn-normal" data-dismiss="modal">关闭</button>
							</div>
						</div>
					</div>
				</div>



				<div class="modal fade" id="viewTrack" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
					<div class="modal-dialog" role="document">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
										aria-hidden="true">&times;</span></button>
								<h3 class="modal-title" id="exampleModalLabel">查看此记录</h3>
							</div>
							<div class="modal-body">
								<div class="row">
									<div class="form-group">
										<div class="col-xs-6">
											<label>跟踪日期</label>
											<input required="required" class="form-control js-datepicker m-b-10"
												type="text" id="viewtracktime" name="viewtracktime" value=""
												data-date-format="yyyy-mm-dd" />
										</div>

										<div class="col-xs-6">
											<label>负责人</label>
											<input required="required" class="form-control" type="text"
												id="viewcontactname" name="viewcontactname">
										</div>
									</div>
									<div class="form-group">
										<div class="col-xs-12">
											<label>简短描述过程及结果</label>
											<textarea required="required" class="form-control" id="viewtrackresult"
												name="viewtrackresult" rows="4"></textarea>
										</div>
									</div>
								</div>

							</div>
							<div class="modal-footer">
								<button type="button" class="btn btn-normal" data-dismiss="modal">关闭</button>
							</div>
						</div>
					</div>
				</div>


			</div>
		</div>

		<script type="text/javascript" src="js/perfect-scrollbar.min.js"></script>
		<link rel="stylesheet" href="js/bootstrap-datepicker/bootstrap-datepicker3.min.css">
		<link href="css/style.css" rel="stylesheet">
		<!--日期选择插件-->
		<script src="js/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>
		<script src="js/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script>
		<script type="text/javascript" src="js/main.js"></script>
		<!--向导插件-->
		<!--对话框-->
		<script src="js/jconfirm/jquery-confirm.min.js"></script>
		<script type="text/javascript" src="js/jquery.bootstrap.wizard.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$('.guide-box').bootstrapWizard({
					'tabClass': 'nav-step',
					'nextSelector': '[data-wizard="next"]',
					'previousSelector': '[data-wizard="prev"]',
					'finishSelector': '[data-wizard="finish"]',
					'onTabClick': function(e, t, i) {
						if (!$('.guide-box').is('[data-navigateable="true"]')) return !1
					},
					'onTabShow': function(e, t, i) {
						t.children(":gt(" + i + ").complete").removeClass("complete");
						t.children(":lt(" + i + "):not(.complete)").addClass("complete");
					}
				});
			});
		</script>

	</body>
</html>
